<template>
  <div>
    <h2>显示</h2>
    投资名称:<input type="text" v-model="sdate.I_Name" /> 投资总额度:<input
      type="text"
      v-model="sdate.Max"
      size="3"
    />-<input type="text" v-model="sdate.Min" size="3" />
    <input type="button" value="查询" @click="Show()" />
    <table class="table table-bordered">
      <thead>
        <tr>
          <td>投资名称</td>
          <td>投资总额度</td>
          <td>已投资额度</td>
          <td>剩余额度</td>
          <td>投资人数</td>
          <td>操作</td>
        </tr>
      </thead>
      <tbody>
        <tr v-for="a in list">
          <td>{{ a.I_Name }}</td>
          <td>{{ a.I_Zong }}</td>
          <td>{{ a.I_Yi }}</td>
          <td>{{ a.I_Sheng }}</td>
          <td>{{ a.I_Number }}</td>
          <td>
            <input type="button" value="删除" @click="del(a.I_Id)" />
            <input type="button" value="修改" @click="gai(a.I_Id)" />
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script setup lang="ts">
import { reactive, toRefs, onMounted } from 'vue';
import axios from 'axios';
import { useRoute, useRouter } from 'vue-router';
let router = useRouter();
let route = useRoute();

let data: any = reactive({
  sdate: {
    I_Name: '',
    Max: '',
    Min: '',
  },
  list: {},
});
let { sdate, list } = toRefs(data);

onMounted(() => {
  Show();
});

const Show = () => {
  axios({
    url: 'http://localhost:61995/api/User/Show',
    method: 'get',
    params: sdate.value,
  }).then((res) => {
    console.log(res);
    list.value = res.data.data;
  });
};

const del = (I_Id: any) => {
  axios({
    url: 'http://localhost:61995/api/User/Shan',
    method: 'get',
    params: {
      I_Id: I_Id,
    },
  }).then((res) => {
    console.log(res);
    if (res.data.data > 0) {
      alert('删除成功');
      Show();
    }
  });
};

const gai = (I_Id: any) => {
  router.push({
    path: '/gai',
    query: {
      I_Id: I_Id,
    },
  });
};
</script>

<style scoped></style>
